<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

</body>
<script>
  // 需求 描述一只猫的名称，颜色，叫声，技能

  // 面向过程 
  var name = "Tom";
  var color = "black";
  var species = "cat";

  function call() {
    console.log("喵喵");
  }

  function skill() {
    console.log("捉老鼠");
  }

  // 面向对象 
  // 1. 字面量对象  => 最简单的面向对象
  // 但是以字面量创建的对象存在一个明显的缺点,每次声明只能创建一个,无法实现代码的复用

  // var Tom = {
  //     name: "Tom",
  //     color: "black",
  //     species: "cat",
  //     call: function () {
  //         console.log("喵喵");
  //     },
  //     skill: function () {
  //         console.log("捉老鼠");
  //     }
  // }
  // console.log(Tom);


  // var Kitty = {
  //     name: "Kitty",
  //     color: "pink",
  //     species: "cat",
  //     call: function () {
  //         console.log("喵喵");
  //     },
  //     skill: function () {
  //         console.log("捉老鼠");
  //     }
  // }
  // console.log(Kitty);

  // 工厂模式 (最简单的)  
  // 优点 调用函数,传入对应的参数  就可以 快速得到想要的对象数据

  // 缺点: 
  // 1. 通过函数创建的对象 和 函数没有任何关系
  // 2. 对象中共有的属性和方法重复声明

  function cat(name, color) {
    var obj = {
      name: name,
      color: color,
      species: "cat",
      call: function () {
        console.log("喵喵");
      },
      skill: function () {
        console.log("捉老鼠");
      }
    }
    return obj;
  }

  var Tom = cat("Tom", "black");
  console.log(Tom);
  console.log(Tom instanceof cat, Tom instanceof Object);
  var Kitty = cat("Kitty", "black");
  console.log(Kitty);



    // 构造函数 
    // var arr = new Array();
    // var obj = new Object();
    // var date = new Date();
    // var p = new Promise(function () { });

    // console.log(arr instanceof Array);
    // console.log(obj instanceof Object);
    // console.log(date instanceof Date);
    // console.log(p instanceof Promise);







</script>

</html>